<template>
  <el-autocomplete
    v-model="nickName"
    :fetch-suggestions="fetchSuggestions"
    value-key="nickName"
    :placeholder="placeholder"
    :disabled="disabled"
    placement="bottom"
    :popper-append-to-body="false"
  ></el-autocomplete>
</template>

<script>
import { userListingIgnorePermission } from '@/api/system/user'

export default {
  name: 'UserCompleteSelect',
  props: {
    value: {
      type: String,
      default: ''
    },
    placeholder: {
      type: String,
      default: '请输入'
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      userList: [],
    }
  },
  computed: {
    nickName: {
      get() {
        return this.value
      },
      set(value) {
        this.$emit('input', value || '')
      }
    }
  },
  created() {
    this.getUserList()
  },
  methods: {
    // 获取用户列表
    getUserList() {
      userListingIgnorePermission().then(res => {
        this.userList = res.data || []
      }).catch(err => {})
    },
    // 输入建议数据
    fetchSuggestions(queryString, callback) {
      const results = this.userList.filter(item => item.nickName.indexOf(queryString) > -1)
      callback(results.length > 0 ? results : this.equipmentList)
    },
  }
}
</script>

<style scoped lang="scss">

</style>
